<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>layui</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link rel="stylesheet" href="../../../lib/layui-v2.6.3/css/layui.css" media="all">
    <link rel="stylesheet" href="../../../css/public.css" media="all">
</head>
<body>
<div class="layuimini-container">
    <!-- 搜索栏 -->
    <fieldset class="table-search-fieldset">
        <legend>搜索信息</legend>
        <div style="margin: 10px 10px 10px 10px">
            <form class="layui-form layui-form-pane" action="" lay-filter="student-search-form">
                <div class="layui-form-item">
                    <div class="layui-inline">
                        <label class="layui-form-label">试卷名称</label>
                        <div class="layui-input-inline">
                            <input type="text" name="subject" autocomplete="off" class="layui-input" placeholder="请输入试卷名称">
                        </div>
                    </div>
                    <div class="layui-inline">
                        <label class="layui-form-label">章节</label>
                        <div class="layui-input-inline">
                            <input type="text" name="section" autocomplete="off" class="layui-input" placeholder="请输入章节">
                        </div>
                    </div>
                    <div class="layui-inline">
                        <label class="layui-form-label">试题内容</label>
                        <div class="layui-input-inline">
                            <input type="text" name="question" autocomplete="off" class="layui-input" placeholder="请输入试题内容">
                        </div>
                    </div>
                    <div class="layui-inline">
                        <button type="submit" class="layui-btn layui-btn-primary" lay-submit lay-filter="data-search-btn">
                            <i class="layui-icon">&#xe615;</i> 搜 索
                        </button>
                    </div>
                </div>
            </form>
        </div>
    </fieldset>

    <div class="layuimini-main">
        <table class="layui-hide" id="currentTableId" lay-filter="currentTableFilter"></table>

        <script type="text/html" id="currentTableBar">
            <a class="layui-btn layui-btn-normal layui-btn-xs data-count-edit" lay-event="edit">编辑</a>
            <a class="layui-btn layui-btn-xs layui-btn-danger data-count-delete" lay-event="delete">删除</a>
        </script>

    </div>
</div>
<script src="../../../lib/layui-v2.6.3/layui.js" charset="utf-8"></script>
<script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>
<script>
    layui.use(['form', 'table'], function () {
        var $ = layui.jquery,
            form = layui.form,
            table = layui.table;

        // 存储当前搜索条件
        var currentSearchParams = {
            subject: '',
            section: '',
            question: ''
        };

        table.render({
            elem: '#currentTableId',
            url: '/answerss',  // 使用基础URL，让Layui自动添加查询参数
            method: 'GET',
            where: {
                // 初始查询参数
                subject: '',
                section: '',
                question: ''
            },
            response: {
                statusCode: 200
            },
            parseData: function(res) {
                return {
                    code: res.code,
                    msg: res.msg,
                    count: res.data.total,
                    data: res.data.records
                };
            },
            cols: [[
                {type: "checkbox", width: 50},
                {field: 'subject', width: 180, title: '试卷名称', sort: true},
                {field: 'question', width: 380, title: '题目信息'},
                {field: 'section', width: 180, title: '所属章节', sort: true},
                {field: 'type', width: 180, title: '题目类型'},
                {field: 'score', width: 180, title: '试题分数', sort: true},
                {field: 'level', width: 180, title: '难度等级', sort: true},
                {title: '操作', minWidth: 250, toolbar: '#currentTableBar', align: "center"}
            ]],
            page: {
                curr: 1,
                limit: 15,
                limits: [10, 15, 20, 50],
                layout: ['prev', 'page', 'next', 'limit', 'count'],
                groups: 5
            },
            skin: 'line',
            // 配置请求参数名称，适配后端接口
            request: {
                pageName: 'page',
                limitName: 'size'
            }
        });

        // 搜索监听
        form.on('submit(data-search-btn)', function (data) {
            const field = data.field;

            // 更新当前搜索条件
            currentSearchParams.subject = field.subject !== undefined ? field.subject.trim() : '';
            currentSearchParams.section = field.section !== undefined ? field.section.trim() : '';
            currentSearchParams.question = field.question !== undefined ? field.question.trim() : '';

            // 重新加载表格，传递搜索条件
            table.reload('currentTableId', {
                where: currentSearchParams,
                page: { curr: 1 }
            });

            return false;
        });

        // 监听分页切换
        table.on('page(currentTableFilter)', function(obj) {
            console.log('分页切换：当前页', obj.curr, '每页条数', obj.limit);

            // 重新加载表格，保持搜索条件
            table.reload('currentTableId', {
                where: currentSearchParams,
                page: {
                    curr: obj.curr,
                    limit: obj.limit
                }
            });
        });




        /**
         * toolbar监听事件
         */
        table.on('tool(currentTableFilter)', function (obj) {
            var data = obj.data;
            console.log(data)
            if (obj.event === 'edit') {
                localStorage.setItem('multiQuestion', JSON.stringify(data)); // 存储完整对象

                var index = layer.open({
                    title: '编辑试卷',
                    type: 2,
                    area: ['50%', '50%'],
                    content: 'questionEditManager.html'
                });
                $(window).on("resize", function () {
                    layer.full(index);
                });
                return false;
            }else if (obj.event === 'delete') {
                layer.confirm('真的删除该题目吗？', function (index) {
                    const questionId = obj.data.questionId;

                    console.log("准备删除题目ID：", questionId);

                    axios.get(`/deleteQuestion/${questionId}`)
                        .then(res => {
                            if (res.data.code === 200) {
                                layer.msg("删除成功");
                                table.reload('currentTableId');  // 局部刷新表格
                            } else {
                                layer.msg("删除失败：" + (res.data.msg || "未知错误"));
                            }
                        })
                        .catch(err => {
                            console.error("删除请求失败：", err);
                            layer.msg("请求失败，请检查网络或后端接口");
                        });
                    layer.close(index);
                });
            }
        });




    });

</script>

</body>
</html>